<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="https://imaboy.gitee.io/universal-ico/favicon.ico" >
    <title>我的手表</title>
    <style>
        a{text-decoration:none;color: blue;}
        a:hover{text-decoration:none;color: blue;}
        .container1{
            flex-direction: column;
            display: flex;
            justify-content: center;
            align-items: center;   
            left: 0px;
            top:0px;         
            width: 454px;
            height: 454px;
			border: 25px solid black;
            background-color: black;
			background-image: url(image/human.gif);
			background-size:200px 200px;
            border-radius: 50%;
        }     
		#time{
			color: blue;
			font-size: 3rem;
		}
		#time1{
			color: blue;
			font-size: 3rem;
		}
		.bushu{
			font-size: 2rem;
			color: blue;
			padding-top: 4rem;
		}
        .tips{
			color: blue;
            font-size: 3rem;
		}
    </style>
    </head>
<body>
    <div class="container1" onmousedown="moveBind(this, event)">
        <div id="time"></div>
		<div id="time1"></div>
		<div class="bushu">👞<nobr id="bushutxt"></nobr></div>
         <div class="tips"><a href="stopping0.html">→</a></div>
    </div>
	<script>
		function doube(w){
			if(w<10){return "0"+w;}
			else{return w;}
		}
		function xxgsf(xq){
			if(xq==1){return "一";}else if(xq==2){return "二";}else if(xq==3){return "三";}else if(xq==4){return "四";}else if(xq==5){return "五";}else if(xq==6){return "六";}else if(xq==0){return "日";}}
	function timeup(){
var d = new Date();
document.getElementById("time").innerHTML=d.getMonth()+1+"月"+d.getDate()+"日周"+xxgsf(d.getDay());
document.getElementById("time1").innerHTML=doube(d.getHours())+":"+doube(d.getMinutes())+":"+doube(d.getSeconds());	
		}
		setInterval(timeup, 1);
		var max=20000;
		var min=10;
document.getElementById("bushutxt").innerHTML=Math.floor(Math.random()*(max-min+1))+min;
	</script>
	<script>
	  function moveBind(obj, evnt) {
        //获得元素坐标。
        var left = obj.offsetLeft;
        var top = obj.offsetTop;
        var width = obj.offsetWidth;
        var height = obj.offsetHeight;

        //计算出鼠标的位置与元素位置的差值。
        var cleft = evnt.clientX - left;
        var ctop = evnt.clientY - top;

        document.onmousemove = function (doc) {
            //计算出移动后的坐标。
            var moveLeft = doc.clientX - cleft;
            var moveTop = doc.clientY - ctop;
			console.log(moveLeft);
			if(moveLeft>100){location.href='stopping0.html';}
        }

        document.onmouseup = function () {
            document.onmousemove = function () { }
        };
    }
</script>
</body>
</html>